<!-- 自设计轮播图 可能出现BUG  -->
<nav class="banner">
    <div class="viewpager">
        <div class="pager ">
            <div class="view">
                <a href="#" title="pcbanner-1" class="imageLink">
                    <img alt="Surface 教育优惠 学生及教职工专享 9 折起"
                        src="https://imgazure.microsoftstore.com.cn/medias/SurfaceCatPage2019CommonBanner-Media-04?context=bWFzdGVyfGltYWdlc3wxNTg4Mjd8aW1hZ2UvanBlZ3xpbWFnZXMvaDAwL2hmYy8xMDEzMTU1ODk4OTg1NC5qcGd8NjkwMDhiNTM2ZmYwMDc3ODA3NmFhMjJmNjljNDcwYTA4MjczZGJiYjRiN2U5N2EzNjZlMzIxNzdiZmU5ZDY4OA">
                </a>
            </div>

            <div class="view">
                <a href="#" title="严苛品质 性价优选 微软认证翻新 Surface 限时特惠 6 折起">
                    <img alt="严苛品质 性价优选 微软认证翻新 Surface 限时特惠 6 折起"
                        src="https://imgazure.microsoftstore.com.cn/medias/SurfaceCatPage2019CommonBanner-Media-05?context=bWFzdGVyfGltYWdlc3wxNzEzNTR8aW1hZ2UvanBlZ3xpbWFnZXMvaGJlL2hkYy8xMDE0NTQ5NzM1MDE3NC5qcGd8YTIwNTQ0NTBiYWIzNzljOGExZjU2MTc4OWM4MGU2NmU4NDEzN2Y5N2RkNTZkZWVkOTMyMDk0MjRlNzU3MGM0OQ">
                </a>
            </div>
            <div class="view">
                <a href="#"
                    title="百变，耀出众 Surface Pro 6 酷睿 i5 128GB 专业键盘盖套餐">
                    <img alt="百变，耀出众 Surface Pro 6 酷睿 i5 128GB 专业键盘盖套餐"
                        src="https://imgazure.microsoftstore.com.cn/medias/SurfaceCatPage2019CommonBanner-Media-02?context=bWFzdGVyfGltYWdlc3w5MDQ4NXxpbWFnZS9qcGVnfGltYWdlcy9oMzYvaDBkLzEwMTQzNDc3MTM3NDM4LmpwZ3w4YjgwMDczNTU3MGEzOGY3MjNkZmVjNWU5ZjhlOTk3ZWE1MDFjN2VlNDMwZmVkMzE1YTQwODE5NjZiYmYzYWI2">
                </a>
            </div>
            <div class="view">
                <a href="#"
                    title="匠心，耀出众 Surface Laptop 2 酷睿 i5 256GB 全色系">
                    <img alt="匠心，耀出众 Surface Laptop 2 酷睿 i5 256GB 全色系"
                        src="https://imgazure.microsoftstore.com.cn/medias/SurfaceCatPage2019CommonBanner-Media-01?context=bWFzdGVyfGltYWdlc3wxMDIyOTZ8aW1hZ2UvanBlZ3xpbWFnZXMvaGU0L2g2Yi8xMDE0MzQ3NzAzOTEzNC5qcGd8NzE4ZTE3ZTc5ZDdkNmZkNjU4ZDE0NjJmNmNkZDU2NmEwNWI5OTdiZDgzYzNmMzExOWQ3MDk4MTcyNTc5MGIxNw">
                </a>
            </div>

            <div class="view">
                <a href="#"
                    title="赋予便携新能量 Surface Go 128GB WiFi 版专业键盘盖套餐">
                    <img alt="赋予便携新能量 Surface Go 128GB WiFi 版专业键盘盖套餐"
                        src="https://imgazure.microsoftstore.com.cn/medias/SurfaceCatPage2019CommonBanner-Media-03?context=bWFzdGVyfGltYWdlc3w2MzIxN3xpbWFnZS9qcGVnfGltYWdlcy9oZDAvaDg2LzEwMTQzNDc3MjY4NTEwLmpwZ3w4MTgwYzI1MmNmYjM3N2FlY2Y2MjRlNzZhM2NkNzc2ZjA1MTE2OTg3MDU2MDk4ZDJmOGExMzk5YjE3MWU2OTg4">
                </a>
            </div>
        </div>
        <div class="button-next"></div>
        <div class="button-prev"></div>
        <div class="pagination">
        </div>
    </div>
</nav>